<template>
  <div class="big-box">
    <div class="title">
      <span v-if="thisComponen.attribute.ifCheck" class="title-span">*</span>
      <div v-for="(item,index) of thisComponen.attribute.titName" :key="index">{{item}}</div>
    </div>
    <div class="con">
      <!-- onkeyup="value=value.replace(/[^\d{1,}\.\d{1,}|\d{1,}]/g,'')" -->
      <input @blur="out" v-model.trim="fileVal" type="number" :placeholder="thisComponen.attribute.placeholder">
    </div>
  </div>
</template>
<script>
export default {
  props: ["thisComponen"],
  data() {
    return {
      fileVal: ""
    };
  },
  watch: {
    // 监听是否是数字类型
    fileVal(newValue, oldValue) {
      if (newValue == undefined) {
        newValue = this.thisComponen.attribute.minValue || 0;
      }
      if (newValue == "0") {
        newValue = Number(newValue);
      }
      // 检测是否是数字
      if (isNaN(newValue)) {
        this.$Toast({
          message: `${this.thisComponen.attribute.titName}不是一个纯数字`,
          position: "middle",
          duration: 3000
        });
        this.fileVal = this.thisComponen.attribute.minValue || 0;
        this.thisComponen.attribute.filedValue = this.fileVal;
        this.$forceUpdate();
        return;
      }
      // 检测当前值是否大于最大值
      if (this.fileVal > this.thisComponen.attribute.maxValue) {
        this.$Toast({
          message: `${this.thisComponen.attribute.titName}不可以大于${
            this.thisComponen.attribute.maxValue
          }`,
          position: "middle",
          duration: 3000
        });
        this.fileVal = this.thisComponen.attribute.maxValue || 0;
        this.thisComponen.attribute.filedValue = this.fileVal;
        this.$forceUpdate();
        return;
      }
      // 检测当前值是否小于最小值
      if (this.fileVal < this.thisComponen.attribute.minValue) {
        this.$Toast({
          message: `${this.thisComponen.attribute.titName}不可以小于${
            this.thisComponen.attribute.minValue
          }`,
          position: "middle",
          duration: 3000
        });
        this.fileVal = this.thisComponen.attribute.minValue || 0;
        this.thisComponen.attribute.filedValue = this.fileVal;
        this.$forceUpdate();
        return;
      }
      // 检测首页是否是0并且第二位不是小数点
      let ValString = `"${this.fileVal}"`;
      let ValArr = ValString.split("");
      if (
        ValArr[1] == "0" &&
        ValArr[2] &&
        ValArr[2] != '"' &&
        ValArr[2] != "."
      ) {
        this.$Toast({
          message: `${this.thisComponen.attribute.titName}请输入正确的数字`,
          position: "middle",
          duration: 3000
        });
        this.fileVal = this.thisComponen.attribute.minValue || 0;
        this.thisComponen.attribute.filedValue = this.fileVal;
        this.$forceUpdate();
        return;
      }
      // 成功赋值
      this.thisComponen.attribute.filedValue = this.fileVal;
      this.$forceUpdate();
    }
  },
  created() {
    this.fileVal = this.thisComponen.attribute.filedValue;
  },
  methods: {
    out(){
      setTimeout(function() {
        var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
        window.scrollTo(0, Math.max(scrollHeight - 1, 0));
      }, 100)
    }
  }
};
</script>

<style scoped>
@import "./../../../static/css/select.css";
</style>
